<div class="modal-header">
    <div class="modal-title">{{record.id ? '编辑【' + record.name + '】信息' : '添加商家'}}</div>
</div>
<nz-spin *ngIf="!i" class="modal-spin"></nz-spin>
<!--<sf *ngIf="i" #sf mode="edit" [schema]="schema" [ui]="ui" [formData]="i" button="none">-->
<!--    <div class="modal-footer">-->
<!--        <button nz-button type="button" (click)="close()">关闭</button>-->
<!--        <button nz-button type="submit" nzType="primary" (click)="save(sf.value)" [disabled]="!sf.valid"-->
<!--                [nzLoading]="service.http.loading">保存-->
<!--        </button>-->
<!--    </div>-->
<!--</sf>-->

<form #f="ngForm"
      *ngIf="i"
      [labelWidth]="140"
      gutter="24"
      nz-form
      se-container="2">
    <!--    <nz-divider nzText="基本信息"-->
    <!--                style="font-size: 14px;color: #6e6e6e"-->
    <!--                [nzDashed]="true"-->
    <!--                nzOrientation="left"></nz-divider>-->
    <se error="商家名称不能为空" label="商家名称" required>
        <input [(ngModel)]="i.name"
               name="name"
               nz-input
               placeholder="商家名称"
               required>
    </se>

    <!--    <se label="所属代理">-->
    <!--        <input nz-input-->
    <!--               name="agencyId"-->
    <!--               [(ngModel)]="i.agencyId"-->
    <!--               placeholder="输入所属代理">-->
    <!--    </se>-->
    <se label="选择代理">
        <nz-select [(ngModel)]="i.agencyId"
                   name="agencyId"
                   nzAllowClear
                   nzPlaceHolder="选择商家"
                   nzShowSearch>
            <nz-option *ngFor="let o of agencies$ | async" [nzLabel]="o.name" [nzValue]="o.id"></nz-option>
        </nz-select>
    </se>

    <se error="联系人不能为空" label="联系人" required>
        <input [(ngModel)]="i.contact"
               name="contact"
               nz-input
               placeholder="输入联系人姓名"
               required>
    </se>

    <se label="联系人电话">
        <input [(ngModel)]="i.phone"
               name="phone"
               nz-input
               placeholder="输入联系人姓名">
    </se>
    <nz-divider [nzDashed]="true"
                nzOrientation="left"
                nzText="位置信息"
                style="font-size: 14px;color: #6e6e6e"></nz-divider>
    <se col="1" label="详细地址">
        <nz-input-group [nzAddOnAfter]="addOnBeforeTemplate">
            <input [(ngModel)]="i.address" name="address" nz-input placeholder="从地图选择商家所在地址" readonly
                   type="text">
            <ng-template #addOnBeforeTemplate>
                <a (click)="showMap()"> <i nz-icon nzTheme="outline" nzType="environment"></i></a>
            </ng-template>
        </nz-input-group>
    </se>
    <se col="1">
        <div class="modal-footer">
            <button (click)="close()"
                    nz-button
                    type="button">关闭
            </button>
            <button (click)="save(f.value)"
                    [disabled]="!f.valid"
                    [nzType]="'primary'"
                    nz-button
                    type="submit">保存
            </button>
        </div>
    </se>
</form>
